import QtQuick 2.14
import QtQuick.Window 2.14
import QtQuick.Layouts 1.12
import QtQuick.Controls 2.14
import QtQuick.Controls.Material 2.12
import Qt.labs.settings 1.1

import "qrc:/_context/Basic"
import "qrc:/_context/CusInput"
import "qrc:/_context/CusButton"
import "qrc:/_context/CusState"
import "qrc:/_context/QmlHints"

// 数据连接界面

Item{
    property int leftWidth: 182
    property int fontsize: 19

    // 连接数据的状态
    property bool connDB: false

    // 消息提示窗体
    Message{
        id:messageTip
        z: 1
        parent: Overlay.overlay
    }
    function message(type, message) {
        if(type!=='success'&&type!=='error'&&type!=='info'){
            return false
        }
        messageTip.open(type, message)
    }

    ColumnLayout {
        anchors.fill: parent
        anchors.rightMargin: 60
        anchors.topMargin: 30
        anchors.bottomMargin: 30
        anchors.leftMargin: 60

        spacing: 20;

        // 提示支持的数据库类型
        RowLayout{
            YaheiText{
                text: "数据库：MariaDB  |  MySQL";
                font.bold: true;
            }
        }

        RowLayout{
            // Layout.minimumWidth: parent.width;
            spacing: 20;

            YaheiText{
                text: "IP地址：";
            }
            CusTextInput{
                id: address;
                implicitWidth: 180;
                text: db_setting.host;
            }


            YaheiText{
                text: "端口：";
            }
            CusTextInput{
                id: port;
                implicitWidth: 180;
                text: db_setting.port;
            }
        }

        RowLayout{
            // Layout.minimumWidth: parent.width;
            spacing: 20;

            YaheiText{
                text: "用户名：";
            }
            CusTextInput{
                id: username;
                implicitWidth: 180;
                text: db_setting.username;
            }

            YaheiText{
                text: "密码：";
            }
            CusTextInput{
                id: password;
                implicitWidth: 180;
                text: db_setting.password;
            }
        }

        RowLayout{
            id: line3Row;
            // width: parent.width;
            spacing: 20;

            YaheiText{
                text: "数据库名：";
            }


            CusTextInput{
                id: dbName;
                implicitWidth: 180;
                text: db_setting.dbname;
            }

            CusButton{
                text: "连接数据库";
                width: 240;

                onClicked: {
                    if(connDB === true){
                        message('info', "数据库已连接……")
                        return;
                    }
                    var _address = address.text;
                    var _port = port.text;
                    var _username = username.text;
                    var _password = password.text
                    var _dbName = dbName.text;

                    if(_address === "" || _port === "" || _username === "" || _password === "" || _dbName === ""){
                        console.log("数据库信息不能为NULL");
                        return;
                    }
                    else{
                        db_setting.host = _address;
                        db_setting.port = _port;
                        db_setting.username = _username;
                        db_setting.password = _password
                        db_setting.dbname = _dbName;
                    }

                    connDB = DBControl.connectDataBase(_address, Number(_port), _username, _password, _dbName);
                    if(connDB){
                        connState.state = "success";
                        var listString = DBControl.getDataBaseInfo();
                        for(var i = 0; i < listString.length; i++){
                            dbInfo.text += listString[i];
                            if(i !== listString.length - 1){
                                dbInfo.text += "\r\n";
                            }
                            if(i === 0){
                                dbInfo.text += "\r\n";
                            }
                        }
                        message('success', "数据库连接成功！！！")

                        // console.log("");
                    }
                    else{
                        connState.state = "failed";
                        message('error', "数据库连接失败@_@")

                        // console.log("");
                    }
                }
            }

            YaheiText{
                text: "连接状态:";
            }

            CusState{
                id: connState;
                state: "default";
            }
        }

        // 分割线
        Rectangle {
            height: 1
            color: tingeOpacityColor
            Layout.fillWidth: true
        }

        // 数据库服务器信息
        GroupBox{
            id: control;
            title: qsTr("数据库服务器信息：");
            implicitWidth: parent.width;

            // anchors.left: parent.left;
            // anchors.right: parent.right;
            // anchors.bottom: parent.bottom;


            label: Label{
                x: control.leftPadding;
                width: control.availableWidth
                text: control.title
                color: "#21be2b"
                elide: Text.ElideRight

                font.bold: true;
                font.family: "Microsoft Yahei";
                font.pixelSize: 20;
            }

            TextEdit{
                anchors.fill: parent;
                id: dbInfo;
                height: 160;
                readOnly: true;

                font.family: "Microsoft Yahei"
                font.pointSize: 16
                color: "green"
                focus: true
            }
        }

    }


    // 保存数据库的配置信息
    Settings {
        id: db_setting;
        category: "Database"

        property string host: "";
        property string port: "";
        property string username: "";
        property string password: "";
        property string dbname: "";

        fileName: "db_config.ini"
    }

}
